<!--  -->
<template>
    <page-header-wrapper @back="() => $router.go(-1)">
        <a-card :bordered="false" >
            <a-form-model :model="config" ref="ruleForm" :rules="rules" :label-col="{ span: 7 }" :wrapper-col="{ span: 17 }" style="max-width: 900px">
                <a-form-model-item label="发票类型" prop="receiptType">
                    <a-radio-group v-model="config.receiptType" @change="typeChange">
                        <a-radio  v-for="(item,i) in receiptTypeList" :key="i" :value="item.id">{{item.name}}</a-radio>
                    </a-radio-group>
                </a-form-model-item>
                <a-form-model-item label="发票抬头" prop="receiptTitle">
                    <a-input v-model="config.receiptTitle" allow-clear placeholder="请输入发票抬头信息"/>
                </a-form-model-item>
                <a-form-model-item label="纳税人识别号" prop="identificationNum">
                    <a-input v-model="config.identificationNum" allow-clear placeholder="请输入纳税人识别号"/>
                </a-form-model-item>
                <a-form-model-item label="基本开户银行" prop="channel">
                    <a-input v-model="config.channel" allow-clear placeholder="请输入基本开户银行"/>
                </a-form-model-item>
                <a-form-model-item label="基本开户账号" prop="bankAccount">
                    <a-input v-model="config.bankAccount" allow-clear placeholder="请输入基本开户账号"/>
                </a-form-model-item>
                <a-form-model-item label="企业注册地址" prop="companyRegisterAddress">
                    <a-input v-model="config.companyRegisterAddress" allow-clear placeholder="请输入企业注册地址"/>
                </a-form-model-item>
                <a-form-model-item label="税务登记固定电话" prop="taxRegisterTel">
                    <a-input v-model="config.taxRegisterTel" allow-clear placeholder="请输入税务登记固定电话"/>
                </a-form-model-item>
                <a-form-model-item v-bind="formItemLayoutWithOutLabel">
                    <a-button type="primary" @click="update">保存</a-button>
                </a-form-model-item>
            </a-form-model>
        </a-card>
    </page-header-wrapper>
</template>

<script>
import { getReceiptConfig , updateReceiptConfig } from '@/api/companys/invoice';
export default {
    data () {
        return {
            config: {
                receiptTitle: '', // 发票抬头，
                identificationNum: '', // 纳税人识别号
                receiptType: 1, // 发票类型
                companyRegisterAddress: '', // 企业注册地址
                channel: '', // 开户行
                bankAccount: '', // 开户账号
                taxRegisterTel: '', // 税务登记固定电话
            },
            receiptTypeList: [
                { id: 1, name: '增值税普通发票'},
                { id: 2, name: '增值税专用发票'},
            ],
            formItemLayoutWithOutLabel: {
                wrapperCol: {
                    xs: { span: 24, offset: 0 },
                    sm: { span: 24, offset: 16 },
                },
            },
            rules: {
                receiptType: [{required: true, message: '请选择发票类型', trigger: 'blur'}],
                receiptTitle: [
                    { required: true, message: '请输入发票抬头信息', trigger: 'blur' },
                ],
                identificationNum: [
                    { required: true, message: '请输入纳税人识别号', trigger: 'blur' },
                ],
                channel: [],
                bankAccount: [],
                companyRegisterAddress: [],
                taxRegisterTel: [],
            },
        };
    },
    created(){
        this.getData();
    },
    methods: {
        getData(){
            let _this = this;
            getReceiptConfig({})
            .then(res => {
                if(res.success){
                    _this.config = JSON.parse(JSON.stringify(res.data));
                }else{
                    _this.$notification['error']({
                        message: '温馨提示',
                        description: res.errMessage,
                        duration: 8
                    })
                }
            })
        },
        // 切换发票类型
        typeChange(e){
            var type = e.target.value;
            console.log(type,'types')
            if(type == 2){
                this.rules.channel = [{ required: true, message: '请输入开户行信息', trigger: 'blur' },];
                this.rules.bankAccount = [{ required: true, message: '请输入银行开户账户', trigger: 'blur' }];
                this.rules.companyRegisterAddress = [{ required: true, message: '请输入企业注册地址', trigger: 'blur' }];
                this.rules.taxRegisterTel = [{ required: true, message: '请输入纳税登记固定电话', trigger: 'blur' }];
            }else{
                this.rules.channel = [];
                this.rules.bankAccount = [];
                this.rules.companyRegisterAddress = [];
                this.rules.taxRegisterTel = [];
            }
        },
        // 保存发票抬头信息
        update(){
            let _this = this
            _this.$refs.ruleForm.validate(valid => {
                if(valid){
                    updateReceiptConfig(_this.config).then(res=>{
                        if(res.success){
                            _this.$notification['success']({
                                message: '温馨提示',
                                description: '保存成功',
                                duration: 8
                            })
                            _this.visible = false;
                            _this.getData()
                        }else{
                            _this.$notification['error']({
                                message: '温馨提示',
                                description: res.errMessage,
                                duration: 8
                            })
                        }
                    })
                }else{
                    console.log('111')
                }
            })
        },
    }
}

</script>
<style scoped>

</style>